<template>
	<div class="npad-dock-container">
		<PadIcon v-for="(item) in props.dockOfList" :key="item.id" :id="item.id" :name="item.name" :icon="item.icon" :nameShow="false"></PadIcon>
	</div>
</template>

<script setup>
	import PadIcon from '../views/PadIcon.vue';
	import { defineProps } from 'vue';
	const props = defineProps({
		dockOfList:{
			type:Array,
			default:new Array()
		}
	})
</script>

<style lang="less">
	.npad-dock-container{
		position: fixed;
		width: 80%;
		height: 15%;
		bottom: 2%;
		left: 50%;
		transform: translateX(-50%);
		background-color: rgba(15, 15, 0, 0.45);
		border-radius: 10px;
		display: flex;
		flex-wrap: wrap;
		padding-top: 10px;
	}
</style>